{include file="public/head"}
<body style="background:#eee">

<header class="aui-header-default aui-header-fixed aui-header-bg">
    <a href="javascript:history.back(-1)" class="aui-header-item">
        <i class="aui-icon aui-icon-back-white"></i>
    </a>
    <div class="aui-header-center aui-header-center-clear">
        <div class="aui-header-center-logo">
            <div class="aui-car-white-Typeface" style="color:black;font-weight: bold;">个人信息</div>
        </div>
    </div>
    <a href="#" class="aui-header-item-icon"   style="min-width:0">
        <!--<i class="aui-icon aui-icon-search"></i>-->
    </a>
</header>


<section class="aui-myOrder-content">
    <div class="aui-prompt"><i class="aui-icon aui-prompt-sm"></i>填写您的个人信息</div>
    <div class="aui-Address-box">
        <p>
            <label for="head_url">
                <img id="m_head_url" src="{$UserInfo.head_url}" onerror="this.src='__STATIC__/User/img/user/head-3_bak.jpg'" style="margin-left:8rem;width: 30%;display: block;border: none;border-radius: 50%;margin-bottom: 1rem" alt="">
                <input type="file" id="head_url" class="upload_pic" style="display: none;">
            </label>
        </p>
        <p>
            <input class="aui-Address-box-input" type="text" placeholder="用户名" value="{$UserInfo.username}" readonly style="color: silver">
        </p>
        <p>
            姓名 : <input class="aui-Address-box-input" type="text" placeholder="姓名" id="name" value="{$UserInfo.name}" >
        </p>
<!--        <p>若要修改手机号,请联系客服</p>-->
    </div>
    <div class="aui-out">
        <a href="javascript:" class="red-color" style="color:#fff" id="save">保存并使用</a>
    </div>
</section>


<script type="text/javascript" src="__STATIC__/User/js/jquery.min.js"></script>
<script type="text/javascript" src="__STATIC__/User/js/aui.js"></script>
<script type="text/javascript" src="__STATIC__/User/js/city.js"></script>
<script type="text/javascript" >
    $(function(){
        //ajax异步图片上传
        $('.upload_pic').change(function(){
            //图片对象
            let that = $(this);
            var formData = new FormData();
            formData.append("image", that[0].files[0]);

            // 上传设置
            $.ajax({
                // 规定把请求发送到那个URL
                url: "{:url('User/forUpload')}",
                type: "post",            // 请求方式
                dtaType: 'json',
                data: formData,//传值就传fd对象了
                processData:false,  //告诉jQuery不要处理数据
                contentType: false,  //告诉jQuery不要设置contentType
                // 请求成功时执行的回调函数
                success: function (data) {
                    if(data.status == 1)
                    {
                        that.prev().attr('src',data.message);
                    }
                    else
                    {
                        alert(data.message);
                    }
                }
            });
        });

        //保存信息
        $('#save').on('click',function () {
            var head_url = $('#m_head_url').attr('src');
            var name = $('#name').val();

            if (name == ''){
                alert('请输入姓名');
                return false;
            }
            

            $.ajax({
                type: "post",
                url: "{:url('User/UserInfo')}",
                data: {
                    head_url: head_url,
                    name: name,
                    
                },
                dataType: "json",
                success: function (data) {
                    if(data.status == 1){
                        alert(data.message);
                        window.location.reload();
                    }else{
                        alert(data.message);
                    }
                }
            });

        })
    })
</script>

</body>
</html>